{extend name='public/modal'}
{block name='content'}
<div class="layui-fluid layui-anim layui-anim-upbit">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <form action="userListJson" class="lotus-search-form layui-form layui-col-space5" method="get">
                        <div class="layui-inline layui-show-xs-block">
                            <input autocomplete="off" class="layui-input" name="username" placeholder="请输入用户名"
                                   type="text">
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <a class="layui-btn lotus-search-btn" lay-filter="search" lay-submit="">
                                <i class="layui-icon">&#xe615;</i></a>
                        </div>
                    </form>
                </div>
                <div class="layui-card-body layui-table-body layui-table-main">
                    <table class="layui-table layui-hide"
                           id="lotus-table"
                           lay-data="{page:true,limits:[10,20,100],loading:true,toolbar:'#toolbarDemo',url:'userListJson',hash:''}">
                        <thead>
                        <tr>
                            <th lay-data="{field:'id', width:80, sort: true}">ID</th>
                            <th lay-data="{field:'username'}">用户名</th>
                            <th lay-data="{field:'title'}">角色</th>
                            <th lay-data="{field:'last_login_time'}">最后登录时间</th>
                            <th lay-data="{field:'last_login_ip'}">最后登录IP</th>
                            <th lay-data="{field:'add_time'}">创建时间</th>
                            <th lay-data="{'width':'120',field:'id',width:130,templet: '#actionTpl'}">操作</th>
                        </tr>
                        </thead>
                    </table>
                    <script id="toolbarDemo" type="text/html">
                        <div class="layui-btn-container">
                            <button class="layui-btn layui-btn-sm" onclick="xadmin.open('添加用户','addUser.html')"><i
                                    class="layui-icon"></i>添加
                            </button>
                        </div>
                    </script>
                    <script id="actionTpl" type="text/html">
                        <button onclick="xadmin.open('编辑用户','editUser.html?id={{d.id}}')"
                                class="layui-btn layui-btn-xs">编辑
                        </button>
                        <button onclick="lotus.del('{{d.id}}','deleteUser')"
                                class="layui-btn layui-btn-danger layui-btn-xs">删除
                        </button>
                    </script>
                </div>

            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['laydate', 'form', 'upload', 'layer', 'jquery'], function () {
        var laydate = layui.laydate
            , upload = layui.upload
            , layer = layui.layer
            , $ = layui.jquery
            , form = layui.form;
        form.render();
    });
</script>
<script>
    $('.lotus-search-btn').on('click', function () {
        var where = {
            username: $('input[name=username]').val(),
        };
        lotus.table(where);
    })
</script>
{/block}
